<template>
  <div id="paas_content">
    <el-dialog
      title="编辑目录信息"
      :visible.sync="directoryDialog"
      width="60%"
      center
      :before-close="handleClose"
    >
      <el-form
        ref="organizationReport"
        :model="directoryReport"
        label-width="130px"
        :rules="rules"
        label-position="right"
      >
        <el-row>
          <el-col :span="12">
            <el-form-item label="上级目录名称">
              <el-input size="mini" v-model="in_name" disabled></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="目录名称" prop="inName">
              <el-input size="mini" v-model="directoryReport.inName"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
      <span slot="footer" class="dialog-footer">
        <el-button size="mini" @click="handleClose">取 消</el-button>
        <button-page :button-list="data.button"></button-page>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  props: ["directoryDialog", "data", "nodeData"],
  name: "editDirectory",
  data() {
    return {
      directoryReport: {
        inType: 2,
        inName: ""
      },
      rules: {
        inName: [
          { required: true, message: "请输入目录名称！", trigger: "blur" },
          { max: 30, message: "不得超过30个字符！", trigger: "blur" }
        ]
      }
    };
  },
  computed: {
    in_name: function() {
      if (this.data.data) {
        return this.data.data.in_name;
      } else {
        return "";
      }
    }
  },
  mounted() {
    this.directoryReport.inName = this.nodeData.name;
  },
  methods: {
    //新增目录模态框关闭
    handleClose() {
      this.$emit("getDialogStatus", "reload");
    },
    //保存事件
    save_btn(btn) {
      this.$refs["organizationReport"].validate(valid => {
        if (valid) {
          this.directoryReport.parentId = this.nodeData.pid;
          this.directoryReport.id = this.nodeData.id;
          this.$post(btn.uri, this.directoryReport).then(res => {
            if (res.data.state === "ok") {
              this.$message.success(res.data.message);
              this.$emit("getDialogStatus");
            } else {
              this.$message.error(res.data.message);
            }
          });
        }
      })
    }
  }
};
</script>

<style scoped lang="scss"></style>
